<script>
import { mapMutations, mapState } from "vuex";

import myHeader from "../components/my-header.vue";

export default {

  // 在组件（限于页面组件）每次加载之前被调用
  // asyncData 的函数是在服务端执行的
  asyncData({ params ,isServer,isClient}, callback) {
    setTimeout(() => {
      console.log(1111111111111,isServer,isClient);
      callback(null, { title: "我操" });
    }, 2000);
  },

  // 组件每次加载前被调用（在服务端或切换至目标路由之前
  fetch ({ store, params }) {
      store.commit('setStars', 5)
  },

  // 如果校验方法返回的值不为 true， Nuxt.js 将自动加载显示 404 错误页面
  validate ({ params }) {
    // Must be a number
    return true
  },

  layout: "float",

  components: {
    myHeader
  },

  computed: {
    ...mapState("center", {
      list: state => state.list
    })
  },

  methods: {
    ...mapMutations("center", ["toggle", "add", "remove"])
  },

  watch: {},

  mounted() {
    this.add("a");
    console.log("center--->", this.list);
    console.log("this--->", this.title);

    console.log("$store", this.$store.state);
  },
  
  created() {}
};
</script>


<template>
    <div>
        <my-header name="传入数据"></my-header> 
        我是页面内容


        <nuxt-link to="list">list</nuxt-link>
    </div>
</template>
